import { AlipayOutlined, WechatOutlined } from '@ant-design/icons';
import { Divider } from 'antd';
import React from 'react';
import { useState, useEffect } from 'react';
import styles from './accountbind.less'

const AccountBind: React.FC = (props) => {
  const [phone, setphone] = useState("")

  useEffect(() => {
    setphone("138****8293")
    return () => {

    }
  }, [])

  return (
    <div>
      <div className={styles.warp}>
        <div className={styles.right}>
          <div className={styles.icon}>
          <WechatOutlined className={styles.wechat}/>
          </div>
          <div>
            <h4>微信绑定</h4>
            <p>当前已绑定 ****</p>
          </div>
        </div>
        <div><a>绑定</a></div>
      </div>
      <Divider />
      <div className={styles.warp}>
        <div className={styles.right}>
          <div className={styles.icon}>
          <AlipayOutlined className={styles.alipay}/>
          </div>
          <div>
            <h4>支付宝绑定</h4>
            <p>当前已绑定 ****</p>
          </div>
        </div>
        <div><a>绑定</a></div>
      </div>
      <Divider />
    </div>
  )
}

export default AccountBind